<!--缓考审批-->
<template>
  <div class="assessment-container">
    <div class="search-container">
      <SelectItem
        :name="'学期'"
        :value="xq"
        @change="
          (e) => {
            xq = e;
          }
        "
        :xqList="xqList"
      ></SelectItem>
      <SelectItem
        :name="'级次'"
        :value="grade"
        @change="
          (e) => {
            grade = e;
          }
        "
        :xqList="gradeList"
      ></SelectItem>
      <SelectItem
        :name="'专业'"
        :value="specialty"
        @change="
          (e) => {
            specialty = e;
          }
        "
        :xqList="specialtyList"
      ></SelectItem>
      <InputItem
        :name="'姓名'"
        :value="stuName"
        @input="
          (e) => {
            stuName = e;
          }
        "
      ></InputItem>

      <SelectItem
        :name="'状态'"
        :value="status"
        @change="
          (e) => {
            status = e;
          }
        "
        :xqList="stateList"
      ></SelectItem>


      <div class="search-button" style="margin-right: 25px;" @click="getSelectCondition">
        <img src="../../../assets/assessment/icon-search.png" alt=""/>
        <span>查询</span>
      </div>
      <!--      <div class="add-button" @click="toChangeRecord()" style="width: 160px;">-->
      <!--&lt;!&ndash;        <img src="../../../assets/assessment/huankao.png" alt=""/>&ndash;&gt;-->
      <!--        <span>提交缓考申请</span>-->
      <!--      </div>-->
    </div>
    <div class="table-container">
      <div class="table-header">
        <div class="item cz">
          <div style="margin-bottom: 5px">状态/操作</div>
        </div>
        <div class="item x">姓名</div>
        <div class="item kcbh">
          级次
        </div>
        <div class="item pycc">队别</div>
        <div class="item xxlx">专业</div>
        <div class="item skjy">缓考原因</div>
        <div class="item nj">日期</div>
        <div class="item jxb">节次</div>
        <div class="item zybc">课程名称</div>
        <div class="item jxbrs">课程编号</div>
        <div class="item zrs">教研室</div>

      </div>
      <div class="table-body" v-for="(item, index) in tableData" :key="index">
        <div class="item cz">
          <!-- 审批中 -->
          <div v-if="item.status == '-1'" class="cz-sp">
            <span>审批中</span>
          </div>
          <div v-if="item.status == '1'" class="cz-sp">
            <span>已审批</span>
          </div>
          <div v-if="item.status == '0'" style="color:#51aef6">
            <span>待审批</span>
          </div>
          <div class="cz-edit" v-if="item.status == '-1'" @click="update('查看',item.id)">
            <img
              src="../../../assets/assessment/icon-plan-record-detail.png"
              alt=""
            />
            <span>查看</span>
          </div>

          <!-- 待提交 -->
          <div
            v-if="item.status == '0'"
            class="cz-save"
            style="margin-left:0px" @click="update('通过',item.id)"
          >
            <img src="../../../assets/assessment/icon-finish.png" alt=""/>
            <span style="color: #51AEF6;">通过</span>
          </div>
          <div v-if="item.status == '0'" class="cz-close" @click="update('驳回',item.id,index)">
            <img src="../../../assets/assessment/icon-close.png" alt=""/>
            <span>打回</span>
          </div>
        </div>
        <div class="item x">
          <div class="x-title">{{ item.name }}</div>
        </div>
        <div class="item right-content">
          <div class="right-content-info">
            <div class="item kcbh" style="width: 116px;">
              <div class="x-title">{{ item.level }}</div>
            </div>
            <div class="item pycc" style="width: 116px;">
              <div class="x-title">{{ item.team }}</div>
            </div>
            <div class="item xxlx" style="width: 186px;">
              <div class="x-title">{{ item.major }}</div>
            </div>
            <div class="item skjy">{{ item.hkdetails }}</div>
            <div class="item nj">
              <div class="item fza" v-for="(fz,index ) in item.kcdateList" :key="index">{{ fz }}</div>

            </div>
            <div class="item jxb">
              <div class="item fza" v-for="(fz,index ) in item.sectionList" :key="index">{{ fz }}</div>
            </div>
            <div class="item zybc">
              <div class="item fza" v-for="(fz,index ) in item.coursenameList" :key="index">{{ fz }}</div>

            </div>
            <div class="item jxbrs">
              <div class="item fza" v-for="(fz,index ) in item.coursenoList" :key="index">{{ fz }}</div>
            </div>
            <div class="item zrs">
              <div class="item fza" v-for="(fz,index ) in item.classroomList" :key="index">{{ fz }}</div>

            </div>

          </div>
          <div class="spjd">
            <div class="spjd-title">排考进度：</div>
            <div class="time-line-horizon">
              <div class="time-line-block" v-for="(block, index1) in item.shspeeds" :key="index1">
                <div class="person-name">{{ block.checkuser }}</div>
                <div class="line-content">
                  <img src="../../../assets/assessment/icon-finish.png" alt="已审批" v-if="+block.chstatus === 1"/>
                  <img src="../../../assets/assessment/icon-dai.png" alt="待审批" v-if="+block.chstatus === 0"/>
                  <img src="../../../assets/assessment/icon-close.png" alt="未审批" v-if="+block.chstatus === -1"/>
                  <div class="date-time">
                    <span class="date">{{ block.checktime }}</span>
                    <span class="time">{{ block.chenckdate }}</span>
                  </div>
                </div>
                <div class="operate" v-if="index1===0">
                  <div class="ly-block" @click="buttonClick('留言',block,index)">
                    <img src="../../../assets/assessment/icon-ly.png" alt=""/>
                    <div class="ly">留言</div>
                  </div>
                </div>
                <div class="operate" v-show="block.checkremark" v-if="index1!==0">
                  <div class="bubble-block" style="width: 100%">
                    <span @click="buttonClick('查看',block)"
                          style=" white-space:nowrap;overflow:hidden;text-overflow:ellipsis;  display: block">{{
                        block.checkremark
                      }}</span>
                    <div class="operate-button">
                      <div
                        class="button-ck"
                        @click="buttonClick('查看',block)"
                        v-show="block.checkremark" v-if="index1!==0"
                      >
                        查看
                      </div>
                      <div
                        class="button-bj"
                        @click="buttonClick('编辑',block)"
                        v-show="block.checkremark" v-if="index1!==0"
                      >
                        编辑
                      </div>
                      <div
                        @click="buttonClick('删除',block)"
                        class="button-sc"
                        v-show="block.checkremark" v-if="index1!==0"
                      >
                        删除
                      </div>
                    </div>
                  </div>
                </div>

              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <el-dialog
      title="添加留言"
      :visible.sync="showAddMessageDialog"
      width="983px"
    >
      <div class="message-container">
        <div>添加留言：</div>
        <div>
          <el-input
            v-model="message.text"
            type="textarea"
            :rows="8"
            style="width: 550px"
          ></el-input>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <button class="green" @click="addText">确 定</button>
      </span>
    </el-dialog>
    <el-dialog
      title="编辑留言"
      :visible.sync="showbjMessageDialog"
      width="983px"
    >
      <div class="message-container">
        <div>编辑留言：</div>
        <div>
          <el-input
            v-model="message.checkremark"
            type="textarea"
            :rows="8"
            style="width: 550px"
          ></el-input>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <button class="green" @click="textSelect">确 定</button>
      </span>
    </el-dialog>
    <el-dialog
      title="查看留言"
      :visible.sync="showckMessageDialog"
      width="983px"
    >
      <div class="message-container">
        <div>查看留言：</div>
        <div>
          <!--                        v-model="block.bjmeaasgeText"-->
          <el-input
            v-model="message.checkremark"
            type="textarea"
            :rows="8"
            style="width: 550px"
            disabled="false"
          ></el-input>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <button class="green" @click="showckMessageDialog = false">确 定</button>
      </span>
    </el-dialog>
    <el-dialog
      title="驳回选择"
      :visible.sync="showExportReportDialog"
      width="1185px"
      class="manual-entry-container"
    >
      <div class="manual-entry-container">
        <el-row>
          <el-col :span="12">
            <div style=" background: rgba(77, 129, 192, 0.1);">打回至:</div>
          </el-col>
          <el-col :span="12">
            <el-radio-group v-model="reportTypep">
              <el-radio
                :label="item.label"
                v-for="(item, index) in reportTypepss"
                :key="index"
                class="large"
              >{{ item.value }}
              </el-radio>
            </el-radio-group>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <div style=" background: rgba(77, 129, 192, 0.1);">打回原因</div>
          </el-col>
          <el-col :span="12">
            <el-input
              v-model="rejectLeaving" type="textarea"
              :rows="7"
              style="width: 450px"
              placeholder="请输入打回原因">
            </el-input>
          </el-col>
        </el-row>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="sureClick">确 定</el-button>
         <el-button type="warning" @click="showExportReportDialog = false" style="margin-left:10% ">取消</el-button>
      </span>
    </el-dialog>

    <div class="bottom-block">
      <div class="export-button">
        <img src="../../../assets/assessment/icon-export.png" alt=""/>
        <span>导出Excel</span>
      </div>
    </div>
  </div>
</template>

<script>
import SelectItem from "../../../components/SelectItem.vue";
import InputItem from "../../../components/InputItem.vue";
import ButtonItem from "../../../components/ButtonItem.vue";
import {
  addMessage,
  getSelectCondition,
  reject,
  updateMessage,
  updateStatus
} from "@/api/examination/approvalDelayedExam";

import {mapGetters} from "vuex";

export default {
  components: {
    SelectItem,
    InputItem,
    ButtonItem,
  },
  data() {
    return {
      message: {
        text: ''
      },
      xq: "2021春",
      xqList: [
        {
          value: "2021春",
          label: "2021春",
        },
        {
          value: "2021夏",
          label: "2021夏",
        },
      ],
      unit: "",
      unitList: [],
      grade: "",
      gradeList: [
         {
          value: "一年级",
          label: "一年级",
        },
        {
          value: "二年级",
          label: "二年级",
        },
      ],
      stuName: "",
      specialty: "",
      specialtyList: [
         {
          value: "计算机专业",
          label: "计算机专业",
        },
      ],
      status: "",
      stateList: [
        {
          value: "待提交",
          label: "待提交",
        },
        {
          value: "审批中",
          label: "审批中",
        },
        {
          value: "已审批",
          label: "已审批",
        },
        {
          value: "待审批",
          label: "待审批",
        },
      ],
      checkedStatus: false,

      tableData: [
        {
          status: "审批中",
          name: "高某某",
          level: "2021级",
          team: "2队",
          major: "计算机",
          hkdetails: "病假",
          njaList: ["2020-2-1", "2020-2-1", "2020-2-1"],
          date: "2020-2-1",
          njb: "2020-2-1",
          jxba: "1,2",
          jxbb: "1,2",
          zybca: "计算机高级语言",
          zybcb: "计算机高级语言",
          jxbrsa: "6人",
          jxbrsb: "6人",
          zrsa: "教研室1",
          zrsb: "教研室1",
          fza: "计算机系",
          fzb: "计算机系",
          shspeeds: [
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "3",
              teacherno: "",
            },
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "2",
              teacherno: "",
            },
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "1",
              teacherno: "",
            },
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "1",
              teacherno: "",
            },
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "1",
              teacherno: "",
            }
          ],
        },

        {
          status: "待提交",
          name: "高某某",
          level: "2021级",
          team: "2队",
          major: "计算机",
          hkdetails: "病假",
          njaList: ["2020-2-1", "2020-2-1", "2020-2-1"],
          date: "2020-2-1",
          njb: "2020-2-1",
          jxba: "1,2",
          jxbb: "1,2",
          zybca: "计算机高级语言",
          zybcb: "计算机高级语言",
          jxbrsa: "6人",
          jxbrsb: "6人",
          zrsa: "教研室1",
          zrsb: "教研室1",
          fza: "计算机系",
          fzb: "计算机系",
          kxzybl: "20%",
          ktcpszbl: "30%",
          zqksszbl: "10%",
          kzkhszbl: "10%",
          ypfj: "是",

          shspeeds: [
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "3",
              teacherno: "",
            },
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "2",
              teacherno: "",
            },
            {
              id: "1267347372828362772",
              checkremark: "の",
              checktime: "2022-01-13",
              checkuser: "教研室主任",
              chenckdate: "11:48:39",
              chstatus: "1",
              teacherno: "",
            }
          ],
        },
      ],
      searchNameList: [],
      rejectLeaving: '',
      reportTypep: "",

      reportTypepss: [

        {
          "label": "1493803391148023811",
          "value": "大队长",
          "id": "242"
        },
        {
          "label": "1493803391206744065",
          "value": "教科处参谋1",
          "id": "242"
        },
        {
          "label": "1493803391206744065",
          "value": "教科处参谋1",
          "id": "242"
        },
        {
          "label": "1493803391206744065",
          "value": "教科处参谋1",
          "id": "242"
        },


        {
          "label": "1493803391240298498",
          "value": "教科处领导",
          "id": "242"
        }

      ],
      showExportReportDialog: false,
      //添加留言
      showAddMessageDialog: false,
      //编辑留言
      showbjMessageDialog: false,
      //查看留言
      showckMessageDialog: false,
      meaasgeText: "",
      courseYpr: "",
      course: "",
      pathname: ''
    };
  },
  mounted() {
    this.getSelectCondition()
  },
  computed: {
    ...mapGetters(['userInfo']),

  },
  methods: {
    toChangeRecord() {
      let pathname = '/' + window.location.pathname.split('/')[1]
      this.$router.push({
        path: pathname + '/approvalDelayedExam/addPlan',
      })
    },
    checkAll() {
      this.tableData = this.tableData.map((item) => {
        return {...item, checked: this.checkedStatus};
      });
    },
    itemChange() {
      this.checkedStatus = this.tableData.every((item) => item.checked);
    },

    update(type, id, index) {
      let obj = {
        id: id
      }
      if (type === '通过') {
        obj.status = '0'
        this.updateStatus(obj)
      } else if (type === '驳回') {
        this.showExportReportDialog = true
        this.rejectUpdat(id, index)
        // obj.status = '3'
        // this.updateStatus(obj)
      } else if (type === "修改") {

        let path = '/' + this.pathname + '/approvalDelayedExam/editPlan'
        console.log(path)
        this.$router.push({
          path: path,
          query: {
            id: id
          }
        })
      } else if (type === "查看") {
        console.log(this.pathname,'this.pathname')
        this.$router.push({
          path: '/' +this.pathname + '/approvalDelayedExam/editPlan',
          query: {
            id: id,
            type: type
          }
        })
      }
    },
    rejectUpdat(id, index) {
      let shspeeds = this.tableData[index].shspeeds
      let arr = []
      let obj
      for (const shspeedsKey in shspeeds) {
        if (+shspeeds[shspeedsKey].chstatus === 1) {
          let checkuser = shspeeds[shspeedsKey].checkuser.split(':')[0]
          obj = {
            label: shspeeds[shspeedsKey].sort,
            value: checkuser,
            id: this.tableData[index].did
          }
          arr.push(obj)
        }
        this.reportTypepss = arr
      }
      console.log(this.reportTypepss)
    },
    sureClick() {

      let obj = {
        id: this.reportTypepss[0].id,
      }
      if (this.reportTypep || this.reportTypep === 0) {
        obj.reject = this.reportTypep
      } else {
        this.$message.error('没有选择打回人');
        return
      }
      if (this.rejectLeaving) {
        obj.leaving = this.rejectLeaving
      } else {
        this.$message.error('没有选择打回原因');
        return
      }
      this.showExportReportDialog = false
      return new Promise(() => {
        //网上评教修改保存
        reject(obj).then(res => {
          if (res.data.code === 200) {
            this.getSelectCondition()
          }
        })

      })

    },
    updateStatus(obj) {
      updateStatus(obj).then(res => {
        if (res.status == 200) {
          this.getSelectCondition()
        }
      })
    },
    buttonClick(type, black,index) {
      this.message = {}
      console.log(black, 'black')
      this.message = {
        id: black.id,
        checkremark: black.checkremark,
        index:index
      }
      if (type === '留言') {
        this.showAddMessageDialog = true
        console.log(this.message)
      } else if (type === '查看') {
        this.showckMessageDialog = true,
          console.log(this.message)
      } else if (type === '编辑') {
        this.showbjMessageDialog = true
        console.log(this.message)
      } else if (type === '删除') {
        this.textDelete()
      }
    },
    addText() {
      // this.showAddMessageDialog = false;
      // this.update(tid, tex);
      console.log( this.tableData[this.message.index].did)
      let obj = {
        id: this.tableData[this.message.index].did,
        leaving: this.message.text
      }
      addMessage(obj).then(res => {

        if (res.status == 200) {
          this.showAddMessageDialog = false;
          this.getSelectCondition()
          this.$message({
            showClose: true,
            message: '添加成功',
            type: 'success'
          });
        }
      })
    },
    textSelect() {
      let obj = {
        id: this.message.id,
        leaving: this.message.checkremark
      }
      updateMessage(obj).then(res => {

        if (res.status == 200) {
          this.showbjMessageDialog = false;
          this.getSelectCondition()
          this.$message({
            showClose: true,
            message: '编辑成功',
            type: 'success'
          });
        }
      })
    },

    textDelete() {
      let obj = {
        id: this.message.id,
        leaving: "",
      }
      updateMessage(obj).then(res => {
        if (res.status == 200) {
          this.$message({
            showClose: true,
            message: '删除成功',
            type: 'success'
          });
          this.getSelectCondition()
        }

      })

    },
    getSelectCondition() {
      let obj = {
        xueqi: this.xq,
        grade: this.grade,
        level: this.specialty,
        name: this.stuName,
        status: this.status,

      };
      this.pathname = window.location.pathname.split('/')[1]
      getSelectCondition(obj).then(res => {
        this.tableData = res.data.data;
        let data = res.data.data
        // for (const Key in this.tableData) {
        //
        // }
        for (let i = 0; i < this.tableData.length; i++) {
          this.tableData[i].kcdateList = []
          this.tableData[i].sectionList = []
          this.tableData[i].coursenameList = []
          this.tableData[i].coursenoList = []
          this.tableData[i].classroomList = []
          this.tableData[i].xbList = []


          for (let j = 0; j < this.tableData[i].courselists.length; j++) {
            this.tableData[i].kcdateList.push(data[i].courselists[j].kcdate)
            this.tableData[i].sectionList.push(data[i].courselists[j].section)
            this.tableData[i].coursenameList.push(data[i].courselists[j].coursename)
            this.tableData[i].coursenoList.push(data[i].courselists[j].courseno)
            this.tableData[i].classroomList.push(data[i].courselists[j].classroom)
            this.tableData[i].xbList.push(data[i].courselists[j].xb)
          }
          for (let x = 0; x < this.tableData[i].shspeeds.length; x++) {
            let role_id = this.userInfo.role_id
            let roleId = this.tableData[i].shspeeds[x].roleId

            let shspeeds = this.tableData[i].shspeeds
            shspeeds[x] = {
              checktime: shspeeds[x].audittime.split('T')[0],
              chenckdate: shspeeds[x].audittime.split('T')[1],
              id: shspeeds[x].id,
              checkremark: shspeeds[x].leaving,
              checkuser: shspeeds[x].reviewer,
              chstatus: shspeeds[x].status,
              sort: shspeeds[x].sort,
              roleId: shspeeds[x].roleId,
            }
            if (role_id == roleId) {
              this.tableData[i].did = this.tableData[i].shspeeds[x].id
              this.tableData[i].status = this.tableData[i].shspeeds[x].chstatus
              console.log(this.tableData[i].shspeeds[x].chstatus)
            }
          }


        }
        // console.log("输出", this.tableData);
      })
    }
  },
};
</script>
<style lang="less" scoped>
.choose-ypr-container {
  width: 100%;
  margin: 0px auto;

  .choose-ypr-search-container {
    .el-input--prefix .el-input__inner {
      padding-left: 30px;
    }

    .el-input__inner {
      &::placeholder {
        color: #b8b8b8;
      }

      &::-webkit-input-placeholder {
        /* WebKit browsers 适配谷歌 */
        color: #b8b8b8;
      }

      &:-moz-placeholder {
        /* Mozilla Firefox 4 to 18 适配火狐 */
        color: #b8b8b8;
      }

      &::-moz-placeholder {
        /* Mozilla Firefox 19+ 适配火狐 */
        color: #b8b8b8;
      }

      &:-ms-input-placeholder {
        /* Internet Explorer 10+  适配ie*/
        color: #b8b8b8;
      }
    }

    display: flex;
    flex-direction: row;
    align-items: center;

    .title {
      font-size: 18px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      line-height: 20px;
      color: #004ca7;
      margin-right: 5px;
    }

    .search-button {
      width: 77px;
      height: 28px;
      line-height: 28px;
      background: #f1f8fe;
      border: 1px solid #51aef6;
      border-radius: 6px;
      cursor: pointer;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;

      > span {
        font-size: 16px;
        font-family: Microsoft YaHei;
        font-weight: 400;
        color: #51aef6;
      }

      > img {
        width: 20px;
        height: 20px;
        margin-right: 4px;
      }
    }

    .button-list {
      display: flex;
      flex-direction: row;
      align-items: center;
      margin-left: 21px;

      .button-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        position: relative;
        width: 69px;
        height: 27px;
        line-height: 27px;
        border: 1px solid #004ca7;
        border-radius: 4px;
        margin-right: 10px;
        text-align: center;
        font-size: 14px;
        font-family: Microsoft YaHei;
        font-weight: 400;
        color: #004ca7;

        .del-icon {
          position: absolute;
          right: 0px;
          top: 0px;
          width: 12px;
          height: 12px;
          padding: 2px;
        }
      }
    }
  }

  .choose-ypr-table-container {
    margin-top: 30px;

    .el-table td,
    .el-table th.is-leaf,
    .el-table--border,
    .el-table--group {
      border-color: #c7d7eb;
    }

    .el-table__header tr,
    .el-table__header th {
      padding: 0;
      height: 57px;
      background-color: #edf2f9;
      font-size: 16px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      line-height: 20px;
      color: #004ca7;
    }

    .el-table__body tr,
    .el-table__body td {
      padding: 0;
      height: 51px;
    }

    .table-data {
      width: 100%;
      border: 0.8px solid #004ca7;
      border-radius: 9px;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: #004ca7;
    }
  }
}

.assessment-container {
  .el-dialog__body {

  }

  .el-dialog__footer {
    padding: 10px 20px 45px;
  }

  .el-checkbox__inner:hover {
    border-color: #004ca7;
  }

  .el-checkbox__inner {
    border: 1px solid #004ca7;
    border-radius: 0;
    height: 18px;
    width: 18px;
  }

  .el-checkbox__inner::after {
    height: 10px;
    left: 6px;
  }

  .el-checkbox__input.is-checked .el-checkbox__inner,
  .el-checkbox__input.is-indeterminate .el-checkbox__inner {
    background-color: #004ca7;
    border-color: #004ca7;
  }

  .manual-entry-container {
    .el-dialog__body {
      > div {
        width: 1014px;
        border: 1px solid rgba(0, 76, 167, 0.8);
        border-radius: 6px;
        margin: 0 auto;

        > div {
          border-bottom: 1px solid rgba(0, 76, 167, 0.39);

          &:last-child {
            border-bottom: none;
          }

          > div {
            display: flex;

            > div {
              height: 96px;
              display: flex;
              align-items: center;
              justify-content: center;

              flex-wrap: wrap;
              flex-direction: row;
              align-content: stretch;

              &:nth-child(1) {
                width: 80%;

                text-align: center;
                font-size: 16px;
                font-weight: bold;
                color: #004ca7;

              }

              &:nth-child(1) {
                height: 200px;
              }
            }
          }
        }
      }
    }

    .el-dialog__footer {
      padding-bottom: 43px;
    }

    .dialog-footer {
    }
  }

  .el-checkbox__input.is-checked + .el-checkbox__label {
    color: #004ca7;
  }

  .el-checkbox.is-bordered.is-checked {
    border-color: #004ca7;
  }

  .el-checkbox__input.is-focus .el-checkbox__inner {
    border-color: #004ca7;
  }
}
</style>
<style lang="less" scoped>
@import "../../../styles/delayedExam.less";


.jxb {
  width: 188px !important;
}

.jxbrs {
  width: 158px !important;
}

.cz-close > img {
  width: 16px;
  height: 16px;
  margin-right: 10px;
}

.cz-close {
  background: #ffefef;
  border: 1px solid #fa5339;
  color: #fa5339;
  box-sizing: border-box;
  width: 78px;
  height: 27px;
  line-height: 24px;
  border-radius: 4px;
  text-align: center;
  margin-top: 10px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  font-size: 16px;
  font-family: Microsoft YaHei;
  font-weight: 400;
}

.assessment-container
.table-container
.table-body
.right-content
.spjd
.time-line-horizon
.time-line-block {
  width: 297px !important;
}

.assessment-container
.table-container
.table-body
.right-content
.spjd
.time-line-horizon::before {
  width: 1195px !important;
}

.search-container {
  justify-content: flex-start !important;
}

/deep/ .szjky .el-dialog__body {
  height: 432px;
}

.choose-ypr-search-container {
  .el-input--prefix .el-input__inner {
    padding-left: 30px;
  }

  .el-input__inner {
    &::placeholder {
      color: #b8b8b8;
    }

    &::-webkit-input-placeholder {
      /* WebKit browsers 适配谷歌 */
      color: #e41111;
    }

    &:-moz-placeholder {
      /* Mozilla Firefox 4 to 18 适配火狐 */
      color: #b8b8b8;
    }

    &::-moz-placeholder {
      /* Mozilla Firefox 19+ 适配火狐 */
      color: #b8b8b8;
    }

    &:-ms-input-placeholder {
      /* Internet Explorer 10+  适配ie*/
      color: #b8b8b8;
    }
  }

  display: flex;
  flex-direction: row;
  align-items: center;

  .title {
    font-size: 18px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    line-height: 20px;
    color: #004ca7;
    margin-right: 5px;
  }

  .search-button {
    width: 77px;
    height: 28px;
    line-height: 28px;
    background: #f1f8fe;
    border: 1px solid #51aef6;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;

    > span {
      font-size: 16px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: #51aef6;
    }

    > img {
      width: 20px;
      height: 20px;
      margin-right: 4px;
    }
  }

  .button-list {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-left: 21px;

    .button-item {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      position: relative;
      width: 69px;
      height: 27px;
      line-height: 27px;
      border: 1px solid #004ca7;
      border-radius: 4px;
      margin-right: 10px;
      text-align: center;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      color: #004ca7;

      .del-icon {
        position: absolute;
        right: 0px;
        top: 0px;
        width: 12px;
        height: 12px;
        padding: 2px;
      }
    }
  }
}

.choose-ypr-table-container {
  margin-top: 30px;

  .el-table td,
  .el-table th.is-leaf,
  .el-table--border,
  .el-table--group {
    border-color: #c7d7eb;
  }

  .el-table__header tr,
  .el-table__header th {
    padding: 0;
    height: 57px;
    background-color: #edf2f9;
    font-size: 16px;
    font-family: Microsoft YaHei;
    font-weight: bold;
    line-height: 20px;
    color: #004ca7 !important;
  }

  .el-table__body tr,
  .el-table__body td {
    padding: 0;
    height: 51px;
  }

  .table-data {
    width: 100%;
    border: 0.8px solid #004ca7;
    border-radius: 9px;
    font-size: 14px;
    font-family: Microsoft YaHei;
    font-weight: 400;
    color: #004ca7;
  }
}

.pagination-block {
  margin-top: 20px;
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.message-container {
  > div {
    display: inline-block;

    &:nth-child(1) {
      padding-left: 111px;
      font-size: 20px;
      color: rgba(0, 76, 167, 1);
      font-weight: bold;
      vertical-align: top;
    }

    &:nth-child(2) {
    }
  }
}
</style>
